<template>
    <!-- 设备管理-报表中心 -->
    <div id="reportAll">
        <div class="content">
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane label="设备日报" name="first"></el-tab-pane>
                <el-tab-pane label="设备周报" name="second"></el-tab-pane>
                <el-tab-pane label="设备月报" name="third"></el-tab-pane>
                <el-tab-pane label="自定义" name="fourth"></el-tab-pane>
            </el-tabs>
            <div class="contentTab">
                <div class="modalBox" v-if="activeName==='first'">
                    <div class="time serchTop">
                        <div class="selectTime">
                            选择时间：
                            <div class="changeBot" @click="prevFn"><Icon type="md-arrow-dropleft"/></div>
                            <DatePicker type="date" :editable='false' :clearable='false' :options="options" placeholder="请选择结束日期" format="yyyy-MM-dd" v-model="day" @on-change="getTimeFn"></DatePicker>
                            <div class="changeBot" @click="nextFn" v-if="pageNext"><Icon type="md-arrow-dropright"/></div>
                        </div>
                        <el-button type="primary" @click="downLoad" size="small">导出</el-button>
                    </div>
                    <div class="time">
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_time.png"/>
                            <span>日均开机时长：{{avgTimes}} H</span>
                            <span>日均工作时长：{{avgWorkTimes}} H</span>
                            <span>日均怠机时长：{{avgIdleTimes}} H</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/reportAll/mach_gx.png"/>
                            <span>日均工作效率：{{avgEfficExp}} %</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_oil.png"/>
                            <span>日均油耗：{{avgOilWear}} L</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="tableBox">
                            <el-table :data="list" height="100%" :stripe="true" >
                                <el-table-column align="center" prop="machCode" label="设备类型/编号">
                                    <template slot-scope="scope">
                                        {{scope.row.machTypeName + '  ' + scope.row.machCode}}
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="times" label="开机时长（H）"></el-table-column>
                                <el-table-column align="center" prop="workTimes" label="工作时长（H）"></el-table-column>
                                <el-table-column align="center" prop="idleTimes" label="怠机时长（H）"></el-table-column>
                                <el-table-column align="center" prop="efficExp" label="工作效率（%）">
                                    <template slot-scope="scope">
                                        {{scope.row.efficExp >= 0  ? scope.row.efficExp : '—'}}
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="oilWear" label="油耗量（L）"></el-table-column>
                                <el-table-column align="center" prop="oilAdd" label="加油量（L）">
                                    <template slot-scope="scope">
                                        {{scope.row.oilAdd >= 0  ? scope.row.oilAdd : '—'}}
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="page">
                            <Page :total="total" :page-size="pageSize" show-elevator show-total @on-change="pageChange" :current.sync="current"></Page>
                        </div>
                    </div>
                </div>
                <div class="modalBox" v-if="activeName==='second'">
                    <div class="time serchTop">
                        <div class="selectTime ">
                            选择时间：
                            <div class="changeBot" @click="prevFn"><Icon type="md-arrow-dropleft"/></div>
                            <DatePicker type="date" :options="options" :editable="false" :clearable="false" :disabled="true" placeholder="请选择开始日期" format="yyyy-MM-dd" v-model="enterTime" style="margin-right: 10px;"></DatePicker>
                            <DatePicker type="date" :editable="false" :clearable="false" :options="options" placeholder="请选择结束日期" format="yyyy-MM-dd" v-model="day" @on-change="getworkTime"></DatePicker>
                            <div class="changeBot" @click="nextFn" v-if="pageNext"><Icon type="md-arrow-dropright"/></div>
                        </div>
                        <el-button type="primary" @click="downLoad" size="small">导出</el-button>
                    </div>
                    <div class="time">
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_time.png"/>
                            <span>日均开机时长：{{avgTimes}} H</span>
                            <span>日均工作时长：{{avgWorkTimes}} H</span>
                            <span>日均怠机时长：{{avgIdleTimes}} H</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/reportAll/mach_gx.png"/>
                            <span>日均工作效率：{{avgEfficExp}} %</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_oil.png"/>
                            <span>日均油耗：{{avgOilWear}} L</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="tableBox">
                            <el-table :data="weekList" width="100%" height="100%" :stripe="true" >
                                <el-table-column label="设备类型/编号" align="right" width="180" prop="machCode" fixed>
                                    <template slot-scope="scope">
                                        <Tooltip transfer :content="scope.row.machCode" placement="top-start" max-width="200">
                                            <div class="deviceName">{{scope.row.machTypeName + "(" +scope.row.machCode+")"}}</div>
                                        </Tooltip>
                                    </template>
                                </el-table-column>
                                <el-table-column label="日期" align="right" width="180">
                                    <el-table-column label="设备数据" width="180">
                                        <template>
                                            <p>
                                                <span>开机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>工作时长（H）</span>
                                            </p>
                                            <p>
                                                <span>怠机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>每日油耗（L）</span>
                                            </p>
                                            <p>
                                                <span>工作效率（%）</span>
                                            </p>
                                        </template>
                                    </el-table-column>
                                </el-table-column>
                                <el-table-column 
                                    v-for="(item, index) in DateList" 
                                    :key="index"
                                    :label="initYMD(item.date)">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.dataList[index].times >=0? porps.row.dataList[index].times: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].workTimes >=0? porps.row.dataList[index].workTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].idleTimes >=0? porps.row.dataList[index].idleTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].oilWear>=0? porps.row.dataList[index].oilWear: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].efficExp >=0? porps.row.dataList[index].efficExp: "—"}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                                <el-table-column label="平均值" fixed="right">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.avgTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgIdleTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgWorkTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgOilWear}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgEfficExp}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="page">
                            <Page :total="total" :page-size="pageSize" show-elevator show-total @on-change="pageChange" :current.sync="current"></Page>
                        </div>
                    </div>
                </div>
                <div class="modalBox" v-if="activeName==='third'">
                    <div class="time serchTop">
                        <div class="selectTime">
                            选择时间：
                            <div class="changeBot" @click="prevFn"><Icon type="md-arrow-dropleft"/></div>
                            <DatePicker type="month" :editable="false" :clearable="false" :options="options" placeholder="请选择日期" format="yyyy-MM" v-model="monthTime" @on-change="getworkTime"></DatePicker>
                            <div class="changeBot" @click="nextFn" v-if="pageNext"><Icon type="md-arrow-dropright"/></div>
                        </div>
                        <el-button type="primary" @click="downLoad" size="small">导出</el-button>
                    </div>
                    <div class="time">
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_time.png"/>
                            <span>日均开机时长：{{avgTimes}} H</span>
                            <span>日均工作时长：{{avgWorkTimes}} H</span>
                            <span>日均怠机时长：{{avgIdleTimes}} H</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/reportAll/mach_gx.png"/>
                            <span>日均工作效率：{{avgEfficExp}} %</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_oil.png"/>
                            <span>日均油耗：{{avgOilWear}} L</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="tableBox">
                            <el-table :data="weekList" width="100%" height="100%" :stripe="true" >
                                <el-table-column label="设备类型/编号" align="right" width="180" prop="machCode" fixed>
                                    <template slot-scope="scope">
                                        <Tooltip transfer :content="scope.row.machCode" placement="top-start" max-width="200">
                                            <div class="deviceName">{{scope.row.machTypeName + "(" +scope.row.machCode+")"}}</div>
                                        </Tooltip>
                                    </template>
                                </el-table-column>
                                <el-table-column label="日期" align="right">
                                    <el-table-column label="设备数据" width="160">
                                        <template>
                                            <p>
                                                <span>开机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>工作时长（H）</span>
                                            </p>
                                            <p>
                                                <span>怠机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>每日油耗（L）</span>
                                            </p>
                                            <p>
                                                <span>工作效率（%）</span>
                                            </p>
                                        </template>
                                    </el-table-column>
                                </el-table-column>
                                <el-table-column 
                                    min-width="120"
                                    v-for="(item, index) in DateList" 
                                    :key="index"
                                    :label="initYMD(item.date)">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.dataList[index].times >=0? porps.row.dataList[index].times: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].workTimes >=0? porps.row.dataList[index].workTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].idleTimes >=0? porps.row.dataList[index].idleTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].oilWear>=0? porps.row.dataList[index].oilWear: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].efficExp >=0? porps.row.dataList[index].efficExp: "—"}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                                <el-table-column label="平均值" fixed="right">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.avgTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgIdleTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgWorkTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgOilWear}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgEfficExp}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="page">
                            <Page :total="total" :page-size="pageSize" show-elevator show-total @on-change="pageChange" :current.sync="current"></Page>
                        </div>
                    </div>
                </div>
                <div class="modalBox" v-if="activeName==='fourth'">
                    <div class="time serchTop">
                        <div class="selectTime">
                            选择时间：
                            <DatePicker type="date" :options="options" :editable="false" :clearable="false" placeholder="请选择开始日期" format="yyyy-MM-dd" v-model="startTime" style="margin-right: 10px;"></DatePicker>
                            <DatePicker type="date" :options="options" :editable="false" :clearable="false" placeholder="请选择结束日期" format="yyyy-MM-dd" v-model="day" style="margin-right: 10px;"></DatePicker>
                            <el-button type="primary" @click="serchTime" size="small">查询</el-button>
                        </div>
                        <el-button type="primary" @click="downLoad" size="small">导出</el-button>
                    </div>
                    <div class="time">
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_time.png"/>
                            <span>日均开机时长：{{avgTimes}} H</span>
                            <span>日均工作时长：{{avgWorkTimes}} H</span>
                            <span>日均怠机时长：{{avgIdleTimes}} H</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/reportAll/mach_gx.png"/>
                            <span>日均工作效率：{{avgEfficExp}} %</span>
                        </div>
                        <div class="totalBox">
                            <img src="../../assets/images/mach/common/mach_oil.png"/>
                            <span>日均油耗：{{avgOilWear}} L</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="tableBox">
                            <el-table :data="weekList" width="100%" height="100%" :stripe="true" >
                                <el-table-column label="设备类型/编号" align="right" width="180" prop="machCode" fixed>
                                    <template slot-scope="scope">
                                        <Tooltip transfer :content="scope.row.machCode" placement="top-start" max-width="200">
                                            <div class="deviceName">{{scope.row.machTypeName + "(" +scope.row.machCode+")"}}</div>
                                        </Tooltip>
                                    </template>
                                </el-table-column>
                                <el-table-column label="日期" align="right">
                                    <el-table-column label="设备数据" width="160">
                                        <template>
                                            <p>
                                                <span>开机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>工作时长（H）</span>
                                            </p>
                                            <p>
                                                <span>怠机时长（H）</span>
                                            </p>
                                            <p>
                                                <span>每日油耗（L）</span>
                                            </p>
                                            <p>
                                                <span>工作效率（%）</span>
                                            </p>
                                        </template>
                                    </el-table-column>
                                </el-table-column>
                                <el-table-column 
                                    min-width="120"
                                    v-for="(item, index) in DateList" 
                                    :key="index"
                                    :label="initYMD(item.date)">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.dataList[index].times >=0? porps.row.dataList[index].times: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].workTimes >=0? porps.row.dataList[index].workTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].idleTimes >=0? porps.row.dataList[index].idleTimes: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].oilWear>=0? porps.row.dataList[index].oilWear: "—"}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.dataList[index].efficExp >=0? porps.row.dataList[index].efficExp: "—"}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                                <el-table-column label="平均值" fixed="right">
                                    <template slot-scope="porps">
                                        <p>
                                            <span>{{porps.row.avgTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgIdleTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgWorkTimes}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgOilWear}}</span>
                                        </p>
                                        <p>
                                            <span>{{porps.row.avgEfficExp}}</span>
                                        </p>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="page">
                            <Page :total="total" :page-size="pageSize" show-elevator show-total @on-change="pageChange" :current.sync="current"></Page>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>

import moment from 'moment'
import { initYMD , initYM,getPreMonth,getNextMonth} from "@/sever/utils.js";
import {getMachDayReportStat_V2,getMachDayReport_V2,getMachCommonReportExport_V2,getMachReport_V2} from '@/api/mach';
export default {
    name: "reportAll",
    data() {
        return {
            activeName:'first',
            deptId:'',
            day:new Date(new Date().getTime() - 86400000),
            maxDate:new Date(new Date().getTime() - 86400000),
            list:[],
            pageNum: 1,
            pageSize: 10,
            total:0,
            current: 1,
            pageNext:false,
            options: {
                disabledDate(date) {
                    return date && date.valueOf() > Date.now() - 86400000;
                }
            },
            avgTimes:0,
            avgIdleTimes:0,
            avgWorkTimes:0,
            avgOilWear:0,
            avgEfficExp:0,
            
            enterTime: new Date(new Date().getTime() - 604800000),
            weekList:[],
            DateList:[],
            initYMD,

            monthTime:new Date(),
            startTime: new Date(new Date().getTime() - 2592000000),
        };
    },
    methods: {
        handleClick(tab, event) {
            this.day=new Date(new Date().getTime() - 86400000)
            this.pageNum=1
            this.current=1
            this.pageNext = false
            if(this.activeName==='first'){
                this.pageSize=10
                this.getAllList()
            }else{
                if(this.activeName==='second'){
                    this.enterTime=new Date(new Date().getTime() - 604800000)
                }
                if(this.activeName==='third'){
                    this.monthTime=new Date()
                }
                if(this.activeName==='fourth'){
                    this.startTime=new Date(new Date().getTime() - 2592000000)
                }
                this.pageSize=3
                this.getPageList()
            }
            this.getMachDayReportStatFn()
        },
        // 获取日平均值
        getMachDayReportStatFn(){
            let params={}
            if(this.activeName==='first'){
               params = {
                    date:initYMD(this.day),
                    deptId:this.deptId,
                }; 
            }
            if(this.activeName==='second'){
               params = {
                    deptId: this.deptId,
                    startDate: initYMD(this.enterTime),
                    endDate: initYMD(this.day),
                }; 
            }
            if(this.activeName==='third'){
                params = {
                    month:initYM(this.monthTime),
                    deptId:this.deptId
                };
            }
            if(this.activeName==='fourth'){
               params = {
                    deptId: this.deptId,
                    startDate: initYMD(this.startTime),
                    endDate: initYMD(this.day),
                }; 
            }
            getMachDayReportStat_V2(params)
                .then(res => {
                    if (res.code == 200) {
                       if(res.data){
                            this.avgTimes = res.data.avgTimes || '0';
                            this.avgIdleTimes = res.data.avgIdleTimes || '0';
                            this.avgWorkTimes = res.data.avgWorkTimes || '0';
                            this.avgOilWear = res.data.avgOilWear || '0';
                            this.avgEfficExp = res.data.avgEfficExp || '0';
                        }else{
                            this.avgTimes = '—';
                            this.avgIdleTimes = '—';
                            this.avgWorkTimes = '—';
                            this.avgOilWear = '—';
                            this.avgEfficExp = '—';
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        // 获取日数据
        getAllList(){
            let params = {
                date:initYMD(this.day),
                deptId:this.deptId,
                pageNum: this.pageNum,
                pageSize: this.pageSize,
            };
            getMachDayReport_V2(params)
                .then(res => {
                    if (res.code == 200) {
                        this.list = res.data.list;
                        this.total = res.data.total;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //翻页
        pageChange(index) {
            this.pageNum = index;
            if(this.activeName==='first'){
                this.getAllList();
            }else{
                this.getPageList()
            }
            this.getMachDayReportStatFn()
        },
        //导出数据
        downLoad(){
            let formdata = new FormData(); // form 表单 {key:value}
            if(this.activeName==='first'){
                formdata.append("date", initYMD(this.day));
                formdata.append("deptId", this.deptId);
            }
            if(this.activeName==='second'){
                formdata.append("deptId", this.deptId);
                formdata.append("startDate", initYMD(this.enterTime));
                formdata.append("endDate", initYMD(this.day));  
            }
            if(this.activeName==='third'){
                formdata.append("month",initYM(this.monthTime));
                formdata.append("deptId", this.deptId);
            }
            if(this.activeName==='fourth'){
                formdata.append("deptId", this.deptId);
                formdata.append("startDate",initYMD(this.startTime));
                formdata.append("endDate", initYMD(this.day));  
            }
            getMachCommonReportExport_V2(formdata).then(res=>{
                if(res.code == 200){
                   window.open(res.data.path)
                } else {
                   this.$Message.warning(res.msg); 
                }
            }).catch(error=>{
                console.log(error)
            })
        },
        // 选择日期
        getTimeFn(){
            this.pageNext = true;
            this.pageNum=1
            this.current=1
            this.getAllList()
            this.getMachDayReportStatFn()
            if(initYMD(this.day) == initYMD(this.maxDate)){
                this.pageNext = false;
            }
        },
        prevFn(){
            this.pageNext = true;
            this.pageNum=1
            this.current=1
            if(this.activeName==='first'){
                let day = new Date(this.day)
                day.setTime(day.getTime()-24*60*60*1000);
                this.day = initYMD(day);
                this.getAllList();
            }else{
                if(this.activeName==='second'){
                    this.day = initYMD(new Date(new Date(this.day).getTime() - 518400000))
                    this.enterTime = initYMD(new Date(new Date(this.day).getTime() - 518400000))
                    if(initYMD(this.day) == initYMD(this.maxDate)){
                        this.pageNext = false
                    }
                }
                if(this.activeName==='third'){
                    this.monthTime = getPreMonth(initYMD(this.monthTime));
                    if(initYM(this.monthTime) == initYM(this.maxDate)){
                        this.pageNext = false
                    }
                }
                
                this.getPageList()
            }
            this.getMachDayReportStatFn()
        },
        nextFn() {
            this.pageNum=1
            this.current=1
            if(this.activeName==='first'){
                let day = new Date(this.day);
                day.setTime(day.getTime()+24*60*60*1000);
                this.day = initYMD(day);
                if(initYMD(this.day) == initYMD(this.maxDate)){
                    this.pageNext = false;
                }
                this.getAllList();
            }else{
                if(this.activeName==='second'){
                   this.day = initYMD(new Date(new Date(this.day).getTime() + 518400000))
                    if (
                        new Date(initYMD(this.day)).getTime() >=
                        new Date(initYMD(this.maxDate)).getTime()
                    ){
                        this.day=this.maxDate
                    }
                    this.enterTime = initYMD(new Date(new Date(this.day).getTime() - 518400000))
                    if(initYMD(this.day) == initYMD(this.maxDate)){
                        this.pageNext = false;
                    } 
                }
                if(this.activeName==='third'){
                    this.monthTime = getNextMonth(initYMD(this.monthTime));
                    if(initYM(this.monthTime) == initYM(this.maxDate)){
                        this.pageNext = false;
                    }
                }
                this.getPageList();
            }
            this.getMachDayReportStatFn()
        },
        // 自定义时间
        serchTime(){
            const startDate =  moment(this.startTime).format('YYYY-MM-DD');
            const endDate = moment(this.day).format('YYYY-MM-DD');
            let num=moment(endDate).diff(startDate,'day')
            if(num>31){
                this.$message({
                    message: '选择周期不得超过31天',
                    type: 'warning'
                });
            }else{
                this.pageNum = 1
                this.current=1
                this.getPageList()
                this.getMachDayReportStatFn()
            }
        },
        // 切换周/月
        getworkTime(index) {
            this.pageNext = true;
            if(this.activeName==='second'){
                this.day = index
                this.enterTime = initYMD(new Date(new Date(this.day).getTime() - 518400000))
                if(initYMD(this.day) == initYMD(this.maxDate)){
                    this.pageNext = false;
                }
            }
            if(this.activeName==='third'){
                if(initYM(this.monthTime) == initYM(this.maxDate)){
                    this.pageNext = false;
                }
            }
            this.getPageList();
            this.getMachDayReportStatFn();
        },
        // 周月
        getPageList() {
            let params = {};
            if(this.activeName==='second') {
                params = {
                    deptId: this.deptId,
                    startDate: initYMD(this.enterTime),
                    endDate: initYMD(this.day),
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                };
            }
            if(this.activeName==='third'){
                params = {
                    month: initYM(this.monthTime),
                    deptId: this.deptId,
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                };
            }
            if(this.activeName==='fourth'){
                params = {
                    deptId: this.deptId,
                    startDate: initYMD(this.startTime),
                    endDate: initYMD(this.day),
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                }; 
            }
            getMachReport_V2(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.total = res.data.total
                        this.weekList = res.data.list
                        this.DateList = [];
                        this.weekList.forEach((v, i) => {
                            this.DateList = this.weekList[i].dataList;
                        });
                        if (this.DateList.length == 0) {
                            this.DateList = [
                                {
                                    date: initY(this.day) + "-01",
                                },
                                {
                                    date: initY(this.day) + "-02",
                                },
                                {
                                    date: initY(this.day) + "-03",
                                },
                                {
                                    date: initY(this.day) + "-04",
                                },

                                {
                                    date: initY(this.day) + "-05",
                                },
                                {
                                    date: initY(this.day) + "-06",
                                },
                                {
                                    date: initY(this.day) + "-07",
                                },
                                {
                                    date: initY(this.day) + "-08",
                                },
                                {
                                    date: initY(this.day) + "-09",
                                },
                                {
                                    date: initY(this.day) + "-10",
                                },
                                {
                                    date: initY(this.day) + "-11",
                                },
                                {
                                    date: initY(this.day) + "-12",
                                },
                            ];
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
    },
    mounted() {
        this.deptId = this.$store.state.porjectObject.deptId;
        this.getAllList()
        this.getMachDayReportStatFn()
    },
};
</script>

<style scoped lang="less">
@import "./../../assets/style/themeBase.less";
#reportAll {
    width: 100%;
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
    background-color: #f5f5f5;
    .content{
        width: 100%;
        height: 100%;
        background: #fff;
        border-radius: 6px;
        padding: 0 20px;
        box-sizing: border-box;
    }
    .contentTab{
        height: calc(100% - 55px);
        .modalBox{
            height: 100%;
            .time{
                height: 50px;
                display: flex;
                align-items: center;
                &.serchTop{
                    justify-content: space-between;
                }
                .changeBot{
                    font-size: 26px;
                    width:30px;
                    line-height:30px;
                    text-align: center;
                    cursor: pointer;
                }
                .selectTime{
                    display: flex;
                    align-items: center;
                }
                .totalBox{
                    display: flex;
                    margin-right: 20px;
                    align-items: center;
                    height:40px;
                    border-radius: 4px;
                    color: #fff;
                    padding: 0 20px;
                    &:nth-child(1){
                        background: linear-gradient(90deg, #46E0D6 0%, #1099D1 100%);
                    }
                    &:nth-child(2){
                        background: linear-gradient(231deg, #66A6FF, #8CF7FD);
                    }
                    &:nth-child(3){
                        background: linear-gradient(134deg, #FFDC44, #FA729A);
                    }
                    span{
                        margin-left: 15px;
                    }
                    img{
                        height:26px;
                    }
                }
            }
            .table{
                height: calc(100% - 100px);
            }
            .tableBox{
                height: calc(100% - 50px);
            }
            .page{
                margin-top: 10px;
                display: flex;
                justify-content: center;
            }
            .deviceName{
                white-space: nowrap;
                text-overflow: ellipsis;
                width:150px;
                overflow: hidden;
            }
        }
    }
}
</style>
